fix(web): properly reload available devices after reprobing#2235
fix(web): properly reload available devices after reprobing#2235joseivanlopez merged 2 commits intoagama-project:beta3from
Conversation
dgdavid
left a comment
There was a problem hiding this comment.
Thanks for taking care.
Indeed, it is an improvement that remind us we should book time for still revisiting these hooks and queries. Also for using the transformations and relying on select when possible, although you've told me offline that it was not applicable here.
| import { StorageDevice } from "~/types/storage"; | ||
|
|
||
| /** | ||
| * @fixme Use a transformation instead of building the devices as part of the fetch function, see |
| const findDevice = (devices: StorageDevice[], sid: number): StorageDevice | undefined => { | ||
| const device = devices.find((d) => d.sid === sid); | ||
| if (device === undefined) console.warn("Device not found:", sid); | ||
|
|
||
| return device; | ||
| }; |
There was a problem hiding this comment.
NP: If possible (and when possible) I'd extract that function from here. Looks like it can be defined somewhere and consumed by this (and potentially others) method instead of be (re)defined/hidden here.
There was a problem hiding this comment.
I am going to add a TODO in order to keep the change as minimal as possible because it goes to beta3 branch.
For clarifying, not only in storage but in other parts of Agama too since
|
3d8594b to
f95beff
Compare
Prepare to release Agama 14: * #1994 * #2041 * #2103 * #2178 * #2189 * #2200 * #2205 * #2209 * #2212 * #2213 * #2214 * #2215 * #2216 * #2217 * #2219 * #2220 * #2224 * #2225 * #2226 * #2227 * #2228 * #2230 * #2231 * #2232 * #2233 * #2235 * #2237 * #2239 * #2241 * #2242 * #2244 * #2245 * #2246 * #2247 * #2248 * #2249 * #2250 * #2251 * #2252 * #2253 * #2254 * #2255 * #2256 * #2257 * #2259 * #2260 * #2262 * #2265 * #2266 * #2268 * #2269 * #2271 * #2272 * #2273 * #2275 * #2276 * #2278 * #2281
Problem
The storage page shows an empty state (no devices found) after activating/deactivating devices.
Steps to reproduce:
Solution
Source of the problem: the query for getting the available devices requires the result of the query for getting all the devices, but it is not refreshed when there are changes in the list of devices.
For solving it, the
useAvailableDeviceshook uses useMemo which refreshes the list of available devices if any of the source data changes (either devices or the list of usable Devices).See https://tkdodo.eu/blog/react-query-data-transformations#2-in-the-render-function: "Especially if you have additional logic in your custom hook to combine with your data transformation, this is a good option."
Testing